{% extends "groups/nav.html" %}
{% block title %}HCP - Groups{% endblock %}

{% block torso %}
<!-- MEDIA include datatable json connection get dragdrop -->

<a href="{{ url('hcp-groups-new') }}">New Group</a>
<div id="groups-table"></div>
{% endblock %}


{% block js %}
{{ super() }}

<script type="text/javascript">
var myDataSource = new YAHOO.util.DataSource("{{ url('hcp-json-groups') }}");
myDataSource.responseType = YAHOO.util.DataSource.TYPE_JSON;
myDataSource.responseSchema = {
    resultsList: "groups", // Dot notation to results array.
    fields: ["cn", "gidNumber", "dn"]
};

// XXX: Escape for URL
// XXX: Dynamic get URL.
var myFormatChange = function(elCell, oRecord, oColumn, oData) {
  elCell.innerHTML = "<a href=\"/groups/edit/" + oRecord.getData("dn") + "/\">" + oData + "</a>";
};

//XXX: include parser:YAHOO.util.DataSource.parseString?
var myColumnDefs = [
  {key:"cn", label:"Name", sortable:true, resizeable:true, formatter:myFormatChange},
  {key:"gidNumber", label:"GID", sortable:true, resizeable:true},
];

var myDataTable = new YAHOO.widget.DataTable("groups-table", myColumnDefs, myDataSource,
  {sortedBy:{key:"cn", dir:"desc"}});

</script>

{% endblock %}
